//
//  PokemonInfoPanel.swift
//  SwiftUI-Pokemaster
//
//  Created by gree on 2020/9/29.
//

import SwiftUI

struct PokemonInfoPanel: View {
    let model: PokemonViewModel
    var abilities: [AbilityViewModel] {
        AbilityViewModel.sample(pokemonID: model.id)
    }
    
    var body: some View {
        VStack(spacing: 20) {
            
            TopIndicator()
            // 基本信息
            Header(model: model)
            
            Text(model.descriptionText)
                .font(.callout)
                .foregroundColor(Color(hex: 0x666666))
                .fixedSize(horizontal: false, vertical: true)
            
            Divider()
            AbilityList(model: model, abilityModels: abilities)
        }
        .padding(
            EdgeInsets(top: 12, leading: 30, bottom: 30, trailing: 30)
        )
        .blurBackground(style: .systemMaterial)
        .cornerRadius(20)
        .fixedSize(horizontal: false, vertical: true)
    }
}


extension PokemonInfoPanel {
    struct TopIndicator: View {
        
        var body: some View {
            RoundedRectangle(cornerRadius: 25.0)
                .frame(width: 40, height: 6)
                .opacity(0.2)
        }
    }
}

/// 基本信息
extension PokemonInfoPanel {
    
    struct Header: View {
        let model: PokemonViewModel
        
        var body: some View {
            HStack(spacing: 18) {
                Image("Pokemon-\(model.id)")
                    .resizable()
                    .frame(width: 68, height: 68)
                  
                // 名字+
                VStack {
                    Text(model.name)
                        .font(.title)
                        .fontWeight(.black)
                        .foregroundColor(model.color)
                    
                    Text(model.nameEN)
                        .font(.subheadline)
                        .foregroundColor(model.color)
                                        
                    Text(model.genus)
                        .font(.subheadline)
                        .foregroundColor(.gray)
                }
                
                Divider()
                    .frame(width: 0.5, height: 44)
                
                VStack(alignment: .center) {
                    VStack(alignment: .leading) {
                        HStack(spacing: 8) {
                            Text("身高")
                                .font(.subheadline)
                                .foregroundColor(.gray)
                            Text(model.height)
                                .font(.subheadline)
                                .foregroundColor(model.color)
                        }
                        HStack(spacing: 8) {
                            Text("体重")
                                .font(.subheadline)
                                .foregroundColor(.gray)
                            Text(model.weight)
                                .font(.subheadline)
                                .foregroundColor(model.color)
                        }
                    }
                    
                    HStack(spacing: 8) {
                        ForEach(model.types){ type in
                            Text(type.name)
                                .foregroundColor(.white)
                                .font(.system(size: 11))
                                .frame(width: 36, height: 14)
                                .background(type.color)
                                .cornerRadius(8)
                
                        }
                    }
                    .padding(.top, 8)
                }
            }
        }
    }
    
}

/// 技能介绍
extension PokemonInfoPanel {
    struct AbilityList: View {
        let model: PokemonViewModel
        let abilityModels:[AbilityViewModel]?
        
        var body: some View {
            VStack(alignment: .leading, spacing: 12, content: {
                Text("技能")
                    .font(.headline)
                    .fontWeight(.bold)
                
                if abilityModels != nil {
                    ForEach(abilityModels!) { abilitie in
                        Text(abilitie.name)
                            .font(.subheadline)
                            .foregroundColor(self.model.color)
                        Text(abilitie.descriptionText)
                            .font(.footnote)
                            .foregroundColor(Color(hex: 0xAAAAAA))
                            .fixedSize(horizontal: false, vertical: true)
                    }
                }
            })
            .frame(maxWidth: .infinity, alignment: .leading)
        }
    }
}

struct PokemonInfoPanel_Previews: PreviewProvider {
    static var previews: some View {
        PokemonInfoPanel(model: .sample(id: 1))
    }
}
